<template>
  <div class="landing" style="background-image:url('../assets/PNG/31.png')">
    <div class="land">
        <p style="font-size:30px;margin-bottom: 40px;">登陆</p>
        <input type="text" placeholder="输入手机号/用户名" v-model="from.phone"> <br>
        <input type="password" placeholder="输入密码" v-model="from.pass">
        <p style="text-align: right; font-size:20px;" @click="get">去注册</p>
        <input type="button" value="登陆" style="background-color:	#00BFFF ;" @click="butt">
    </div>
  </div>
</template>

<script>
import logo from "../assets/PNG/31.png";
import { user_login } from "../api/api";
export default {
 name:'landing',
 logo,
 data(){
    return{
        list:[],
        from:{phone:'',pass:''},
    }
 },
 methods:{
    get(){
        this.$router.push('/enroll')
    },
    butt(){
        user_login({phone:this.from.phone,pass:this.from.pass}).then((res)=>{
            if(res.data.code==200){
                alert('欢迎登陆')
                this.$router.push('/down/shouye')
                window.localStorage.setItem('token',res.data.token)
                window.localStorage.setItem('userid',res.data.userinfo.id)
                console.log(res.data);
               
            }else{
                alert('账号或密码错误请重新登陆')
            }
         
    })
   
    
 }
    }
 }

</script>

<style scoped>
body{
    height: 100%;
  
}
.landing{
    margin: auto;
    text-align: center;
    /* background-color: aqua; */
    background-image: url('../assets/PNG/31.png');
 
}
.land{
    width: 310px;
    height: 100%;
    margin: 130px auto;
    text-align: center;
    
}
input{
    width: 300px;
    height: 40px;
    margin-bottom: 10px;
    border-radius:40px ;
    text-align: center;
    font-size: 20px;
}

</style>